<template>
  <div>
    <van-nav-bar
      title="文章详情"
      left-text="返回"
      right-text="主页"
      left-arrow
      @click-left="onClickLeft"
      @click-right="submitRecruit"
    />
    <van-skeleton style="margin-top:75px;" title :row="14" v-if="article.length == 0" />
    <div v-else style="margin-top:46px;">
      <!-- 顶部图片 -->
      <van-image width="10rem" style="margin-bottom:15px;" fit="contain" :src="article.recImgsrc" />

      <div v-html="article.body"></div>
    </div>
  </div>
</template>

<script>
import formatDateTime from '../../../utils/data'
import myheader from '../../../comon/myheader.vue'
export default {
  components: {
    myheader,
  },
  data() {
    return {
      id: this.$route.params.id,
      active: this.$route.params.active,
      content: '',
      article: '',
      show: false,
    }
  },
  mounted() {
    this.init()
  },
  methods: {
    formatDateTime(val) {
      return formatDateTime.formatDateTime6(val)
    },
    async init() {
      const res = await this.$axios.get('https://v2.alapi.cn/api/new/detail', {
        params: {
          docid: this.id.toString(),
          token: this.$path.ALAPI_TOKEN,
        },
      })
      if ((res.data.code = 200)) {
        this.article = res.data.data
      }
    },
    onClickLeft() {
      this.$router.push('/hotNews/' + this.active)
    },
    submitRecruit() {
      this.$router.push('/home')
    },
  },
}
</script>
 <style scope>
p {
  font-size: 16px;
  text-indent: 2em;
  padding: 0.2rem 0.5rem;
  margin: 15px 0 !important;
  font-size: 17px;
  color: #616466;
}
.content {
  font-size: 17px;
  color: #616466;
  margin: 10px 0 20px;
}
.img-place-holder {
  height: 0 !important;
}
.view-more {
  display: none;
}
.viewmore {
  height: 40px;
  line-height: 40px;
  background: #f0f0f0;
  color: #b8b8b8;
  margin-bottom: 25px;
  text-align: center;
  font-size: 16px;
  width: 90%;
  margin: 30px auto;
}
.popup {
  height: 65%;
  padding: 10% 3% 0 3%;
}
.van-popup__close-icon--top-right {
  position: fixed !important;
  right: 18px !important;
  top: 37% !important;
}
</style>
